<template>
	<view class="detail">
        <SRV-topbar title="资产总览" :isLeft="true"></SRV-topbar>
        <!-- <view class="columbTitle">资产总览</view> -->
		<view class="list-box" v-for="(item,index) in list" :key="index">
			<view class="title"> {{item.title}} </view>
			<view class="val"> {{item.val}} </view>
			<view class="btn">
                <text class="btn-item" v-for="(item2,index2) in item.buttonList" :key="index2" @click="jump(item2.jumpType, item2.jumpLink)">
                    {{item2.title}}
                </text>
            </view>
		</view>
        <view class="columbTitle" v-if="royalty.length > 0">累计收益</view>
        <view class="list-box" v-for="(item,index) in royalty" :key="index">
        	<view class="list-left"> {{item.title}} </view>
        	<view class="list-right"> {{item.val}} </view>
        </view>
	</view>
</template>

<script>
	var _self;
	import serve from '../../static/request.js';
	import common from '../../static/jump.js';
	export default {
		data() {
			return {
				list: [],
                royalty: [],
			}
		},
		methods: {
			getInfo() {
				serve.request({
					url: '/member/account/main',
					data: {
						appkey: uni.getStorageSync('appkey'),
						'access-token': uni.getStorageSync('access-token')
					},
                    v: '/v3'
				}).then(res => {
					_self.list = res.data.list;
                    _self.royalty = res.data.royalty;
				});
			},
			jump(jump_type, jump_link) {
				common.jump(jump_type, jump_link)
			}
		},
		onLoad() {
			_self = this;
			_self.getInfo();
		},
		onPullDownRefresh() {
			_self.getInfo();
		},
	}
</script>

<style scoped>
	.detail {
		font-size: 32rpx;
		color: #1e2022;
	}
    .title{
        width: 30%;
    }
    .val{
        width: 30%;
    }
    .btn{
        width: 40%;
        text-align: right;
    }
    .btn-item{
        padding: 5rpx 20rpx;
        border: 1rpx solid #eaeaea;
        color: #3939FD;
        margin-right: 20rpx;
    }
    .columbTitle {
        padding: 20rpx;
        font-size: 36rpx;
        border-bottom: 1rpx solid #eaeaea;
    }
	.list-box {
		border-bottom: 2rpx solid #eaeaea;
		display: flex;
		justify-content: space-between;
		align-content: center;
		padding: 20rpx;
	}
	.but-box {
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100vw;
		background: #ffffff;
	}
</style>
